<template src="./template.html"></template>

<script>
import ResizeMixin from 'mixins/resize'
import { PAGE_CONFIG } from 'common/consts';
import InfoMixin from '../infoMixins'
import { COL_INDEXS, PUBLIST_STATUS } from './consts';
import { getCourseStuGroup, deleteCourseStuGroup, courseSelfGroup } from '../models';

import addDialog from './add-dialog.vue'
import AddTrainee from '../add-trainee'
import RemoveTrainee from '../remove-trainee'

export default {
  components: { addDialog, AddTrainee, RemoveTrainee },
  mixins: [ResizeMixin, InfoMixin],
  data() {
    return {
      COL_INDEXS,
      PUBLIST_STATUS,
      isPageLoading: false,

      tableList: [],
      PAGE_CONFIG: PAGE_CONFIG,
      pageNo: PAGE_CONFIG.defaultPageNo,
      pageSize: PAGE_CONFIG.defaultPageSize,
      totalCount: 0,
      filterForm: {
        q: ''
      },

      editForm: {
        groudId: '',
        groupName: ''
      },
      editDialogVisible: false,
      groupDialogVisible: false,
      removeDialogVisible: false,

      groupForm: {
        groudId: '',
        title: ''
      }
    };
  },

  methods: {
    $groupTips() {
      if (this.tableList.length <= 0) {
        this.$message.warning('请先完成分组创建！')
      }
    },
    $handleGroup(row) {
      this.groupForm.groudId = row.id
      this.groupForm.title = `${row.groupName}添加组员`
      this.groupDialogVisible = true
    },
    $removeUser(row) {
      this.groupForm.groudId = row.id
      this.groupForm.title = `${row.groupName}移除组员`
      this.removeDialogVisible = true
    },
    $handleEdit(row) {
      this.editForm.groudId = (row || { id: '' }).id
      this.editForm.groupName = (row || { groupName: '' }).groupName
      this.editDialogVisible = true
    },
    $search() {
      this.pageNo = 1
      this.$getTableList()
    },
    // 删除请求
    async $handleDeleteHttp(params) {
      try {
        this.isLoading = true
        await deleteCourseStuGroup(params)
        this.$message.success('删除成功')
        if (this.totalCount <= 1) {
          this.$handleSwitch(0)
        }
        this.$search()
      } catch (err) {
        this.isLoading = false
        this.$message.error(err.retDesc || err.message || '删除出错')
      }
    },
    // 删除点击
    $handleDelete(row) {
      const params = {
        id: row.id
      }
      this.$confirm('你确定要删除当前分组吗？删除后组内学员将进行解绑', {
        type: 'warning',
        confirmButtonText: '删除',
      }).then(() => {
        this.$handleDeleteHttp(params)
      }).catch(() => {
        console.log('取消');
      });
    },
    async $getTableList() {
      this.isPageLoading = true;
      const params = {
        ...this.filterForm,
        limit: this.pageSize,
        page: this.pageNo,
        courseId: this.courseId
      };
      try {
        const { data } = await getCourseStuGroup(params);
        this.tableList = data.list || []
        this.totalCount = data.total
        this.isPageLoading = false;
      } catch (err) {
        this.isPageLoading = false;
        this.$message.error(err.message || err.message || '获取机构列表出错')
      }
    },
    $handlePageChange() {
      this.$getTableList();
    },
    $addSuccess(cb) {
      this.$search()
      this.editDialogVisible = false
      if (cb) {
        cb()
      }
    },
    $addTraineeSuccess(cb) {
      this.$search()
      this.groupDialogVisible = false
      this.removeDialogVisible = false
      if (cb) {
        cb()
      }
    },
    async $handleSwitch(newVal) {
      const params = {
        courseId: this.courseId,
        isSelfGroup: newVal
      }
      this.isPageLoading = true
      try {
        await courseSelfGroup(params)
        this.$message.success('操作成功')
        this.isPageLoading = false
        this.oldIsSelfGroup = newVal
        this.infos.isSelfGroup = newVal
        // this.$getCourseInfo()
      } catch (err) {
        this.isPageLoading = false
        this.infos.isSelfGroup = this.oldIsSelfGroup
        this.$message.error(err.message || '操作失败')
      }
    }
  },
  created() {
    this.$getTableList();
  },
};
</script>
